<template>
	<section>
		<header class="bbtm fixed_u w100 wallfff">
			<a href="javascript:history.back()" class="_h"><i class="iconfont icon-Goback"></i></a>
			<h1 class="sz36 hue333 flex_core fontwt hei100">丰田 汉兰达</h1> 
		</header>
		<div class="content">
			<div class="myswiper">
				<mt-swipe :auto="4000">
				  <mt-swipe-item>1</mt-swipe-item>
				  <mt-swipe-item>2</mt-swipe-item>
				  <mt-swipe-item>3</mt-swipe-item>
				</mt-swipe>
			</div>
			<div class="introduce plr30 pud30">
				<p class="p_name">广汽丰田汉兰达</p>
				<p class="p_piec">厂商指导价：<span>23.98-42.28</span>万</p>
				<p class="p_tuan">已有<span>500</span>/1000人参团，<span>23:34:24</span>后结束</p>
			</div>
			
			<div class="data_card plr30 wallfff">
				<p class="data_tite"><i></i>车辆信息</p>
				<ul>
					<li><span class="aline">品牌</span><a class="aline">广汽丰田</a></li>
					<li><span class="aline">级别</span><a class="aline">SUV</a></li>
					<li><span class="aline">颜色分类</span><a class="aline">黑色 白色 红色</a></li>
					<li><span class="aline">变速箱</span><a class="aline">具体车型具体数据</a></li>
					<li><span class="aline">价格区间</span><a class="aline">23.98-42.28万</a></li>
					<li><span class="aline">整车质保</span><a class="aline">3年</a></li>
				</ul>
			</div> 
		</div> 
		
		<footer class="w100">
			<div class="hei100 flexs">
				<a class="flex_middle relation">
					<i class="iconfont icon-dianhua "></i>
					<div class="centre dianhuaName">
						<p class="flex1 ">咨询客服</p>
					 	<p  class="flex1 ">9:00-21:00</p>
					</div>
					
				</a>
				<a class="purchase flex1 flex_middle flex_core">立即加入团购</a>
			</div>
		</footer>
	</section>
</template>

<script>
	import { Swipe, SwipeItem } from 'mint-ui';
	export default{
		name:'buyCarProduct',
		data(){
			return{
				
			}
		}, 
		created:function(){
			/*this.$store.commit('upType');*/ 
		}
		
	}
</script>

<style scoped>
	footer{
		position: fixed;
		z-index: 50;
		bottom: 0;
		left: 0;
		background-color: #fff;
	}
	.relation{
		width: 40%;
	}
	.relation i{
		display: inline-block;
		width: 45%;
		height: 100%;
		line-height:1.3333333333rem;
		text-align: center;
		font-size: 0.6666666666rem;
		color: #333;
		font-weight: 600;
	}
	.purchase{
		background-color: #DF4444;
		font-size:0.4rem;
		color: #fff;
	}
	.dianhuaName{
		font-size: 0.32rem;
		font-weight: 600;
		color: #333;
	}
	.myswiper{
		
		width: 100%;
		height: 6.4rem;
	}
	.content{
		margin:1.3333333333rem 0;
	}
	.introduce{
		background-color: #fff;
		margin-bottom: 0.1333333333rem;
	}
	.introduce .p_name{
		font-size: 0.48rem;
		line-height: 0.5333333333rem;
		color: #333;
	}
	.introduce .p_piec{
		font-size: 0.3733333333rem;
		color: #999999;
		margin:0.4666666666rem 0;
	}
	.introduce .p_tuan{
		font-size: 0.3733333333rem;
		color: #333;
	}
	.introduce .p_tuan span{
		color: #DF4444;
	}
	/*车辆信息*/
	.data_card .data_tite{
		padding: 0.6666666666rem 0;
		font-size: 0.4533333333rem;
		color: #333;
		font-weight: 600;
	}
	.data_card .data_tite i{
		display: inline-block;
		width: 0.1333333333rem;
		height: 0.5333333333rem;
		background-color: #DF4444;
		margin-right: 0.2666666666rem;
		margin-bottom:-0.1333333333rem;
		border-top-left-radius:0.0666666666rem;
		border-top-right-radius:0.0666666666rem;
		border-bottom-left-radius:0.0666666666rem;
		border-bottom-right-radius:0.0666666666rem;
	}
	.data_card ul{
		width: 100%;
	}
	.data_card ul li{
		height: 1.2rem;
		line-height: 1.2rem;
		width: 100%;
		border-top:0.0266666666rem solid #dddddd ;
		font-size: 0.3733333333rem;
	}
	.data_card ul li span{
		color: #333;
		width: 40%;
		display: inline-block;
	}
	.data_card ul li a{
		color: #999;
		width: 60%;
		display: inline-block;
	}
</style>